<template>
    <section>
        <el-form :model="PicEdit">
            <el-form-item>
                <label>主图</label>
                <el-upload action="//jsonplaceholder.typicode.com/posts/" :thumbnail-mode="true" type="drag" :on-preview="handlePreview"
                    :on-success="handSuccess">
                    <i class="el-icon-upload"></i>
                    <div class="el-dragger__text"><em>点击上传</em></div>
                    <div class="el-upload__tip" slot="tip">只能上传jpg/png文件，且不超过500kb</div>
                    </el-upload>
            </el-form-item>
            <el-form-item label="内容">
                <el-input type="textarea" :rows="5" v-model="PicEdit.contents"></el-input>
            </el-form-item>
        </el-form>
        <el-col :span="24" style="margin-bottom: 10px;">
            <el-button type="primary">更新商品</el-button>
            <el-button style="float:right;" @click="returnPicList">返回</el-button>
        </el-col>
    </section>
</template>
<script>
    export default {
        data() {
            return {
                imgName: '',
                visible: false,
                previewVisible: false,
                previewImageUrl: "",
                PicEdit: [{
                    contents: ''
                }],
            }
        },
        methods: {
            handlePreview(file) {
                this.previewImageUrl = file.url;
                this.previewVisible = true;
            },
            handSuccess(response, file, fileList) {
                fileList.length = 0;
                fileList.push(file);
            },
            handleView(name) {
                this.imgName = name;
                this.visible = true;
            },
            returnPicList() {
                this.$router.push('/products/undefined/images');
            },
        }
    }
</script>